<%@ page contentType="text/html;charset=UTF-8"%>
<%@ include file="../../include/tag.jsp"%>
<!DOCTYPE html>
<html lang="zh">
<head>
<title>个人名片</title>
<%@include file="../../include/commonFile.jsp"%>
	<link rel="stylesheet" href="${ctxStatic}/layui-v2.2.45/layui/css/modules/layer/default/layer.css"/>
<style type="text/css">

body{
	min-width: auto!important;
	background-color: white!important;
}

.info-container {
	padding-top: 10px;
	margin: 0px auto;
	width: 90%;
}

.info-container div {
	line-height: 30px !important;
}

.info-container .member-logo {
	margin-bottom: 0;
	position: relative;
}

.layui-input {
	border: 0px;
}

.layui-form-item {
	margin-bottom: 0px !important;
}

.layui-form-item .layui-inline {
	margin-bottom: 0px !important;
}

.layui-form-item .layui-input-inline {
	margin-bottom: 0px !important;
}

.vip-big {
	position: absolute;
	right: -6px;
	bottom: 0px;
	background-color: #fff;
	display: block;
	width: 24px;
	height: 24px;
	text-align: center;
	border-radius: 50%;
	color: #e8473f;
}

.vip-big .vip-big-font{
    font-size: 26px;
    position: absolute;
    color: #e8473f;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%,-47%);
    transform: translate(-50%,-47%);
}

.user-infos {
	display: block;
	width: 100%;
	text-align: center;
}

.veritcal-center {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%);
}

.avater-big {
	width: 80px;
	height: 80px;
	display: inline-block;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	border-radius: 50%;
	position: relative;
	border: #fff 2px solid;
}
.huangguan-big {
    font-size: 20px !important;
    color: #ffc107 !important;
}

.footer-buttons {
	position: fixed;
	bottom: 0;
	right: 0;
	left: 0;
	background: #fff;
	padding: 10px;
	text-align: right
}
.footer-place{
	height: 58px;
}

</style>
</head>
<body>
	<div class="layui-form info-container">
		<div class="member-logo">
			<div class="user-infos vertical-center">
				<div class="avater-big" id="logo" style="background-image: <c:if test="${member.logo != null}">url('${member.logo}?imageMogr2/auto-orient/crop/126x126'),</c:if>url(${ctx}/image/def_user_logo.png);">
					<%--<div class="vip-big" id="userStatus" ${member.userStatus != 1 ? 'style="display: none;"' : '' }>
						<span class="iconfont icon-vip red vip-big-font"></span>
					</div>--%>
				</div>
				<div id="username_content">
					<span class="f16 red">${member.realname}</span>
					<span
						class="iconfont icon-huangguan huangguan-big" ${member.isExpert != 1 ? 'style="display: none;"' : '' } ></span>
					<span class="f16">${member.jobTitle}</span>
				</div>
			</div>
		</div>
		<table class="layui-table" lay-skin="nob">
			<colgroup>
				<col width="120">
				<col>
			</colgroup>
			<tbody>
				<tr>
					<td class="tr">用&nbsp;户&nbsp;名</td>
					<td class="tl">${member.username}</td>
				</tr>
				<tr>
					<td class="tr">真实姓名</td>
					<td class="tl">${member.fullname}</td>
				</tr>
				<tr>
					<td class="tr">性&emsp;&emsp;别</td>
					<td class="tl"><c:if test="${not empty member.sex}">${member.sex == '1' ? '男' : '女'}</c:if></td>
				</tr>
				<tr>
					<td class="tr">联系方式</td>
					<td class="tl">${member.mobile}</td>
				</tr><tr>
					<td class="tr">微&emsp;&emsp;信</td>
					<td class="tl">${member.wechatNum}</td>
				</tr>
				<tr>
					<td class="tr">公司名称</td>
					<td class="tl">${member.company}</td>
				</tr>
				<tr>
					<td class="tr">所在地点</td>
					<td class="tl">${city.name}</td>
				</tr>
				<tr>
					<td class="tr">所属行业</td>
					<td class="tl">${industry.name}</td>
				</tr>
				<tr>
					<td class="tr">对接资源</td>
					<td class="tl">${member.wantRes}</td>
				</tr>
				<tr>
					<td class="tr">众筹链接</td>
					<td class="tl" style="word-break: break-all;">${zcLink}</td>
				</tr>
			</tbody>
		</table>
		<div class="footer-buttons">
			<a class="layui-btn layui-btn-danger z-copy-btn" href="javascript:void(0)" data-id="${zcLink}" data-msg="链接已复制到剪贴板">复制个人众筹链接</a>
			<a class="layui-btn layui-btn-normal" href="javascript:closeSelf()" >关闭</a>
		</div>
		<div class="footer-place"></div>
	</div>
	<script type="text/javascript" src="${ctxStatic}/ZeroClipboard/ZeroClipboard.min.js"></script>
	<script  src="${ctxStatic}/layui-v2.2.45/layui/lay/modules/layer.js"></script>
	<script type="text/javascript" src="${ctx}/script/common/util.js"></script>
	<script>
        $(function(){
            $('.z-copy-btn').each(function (i) {
                clipboard(this, this.dataset.id, this.dataset.msg);
            })
        })

        function closeSelf() {
            var index = parent.layer.getFrameIndex(window.name); //获取窗口索引
            top.layer.close(index);
        }

        /**
         *  复制到剪贴板
         * @param button 按钮id
         * @param text 要复制的文本
         * @param msg 复制成功提示文本
         * @returns {boolean}
         */
        function clipboard(btnO,text,msg) {
            if (window.clipboardData) {    //for ie
                btnO.onclick = function () {
                    window.clipboardData.setData('text', text);
                    util.layerMsgSuccess(msg);
                }
            } else {
                var client = new ZeroClipboard($(btnO));
//            client.setHandCursor(true);
                client.on('ready', function (event) {

                    client.on('copy', function (event) {
                        event.clipboardData.setData("text/plain", text);
                        util.layerMsgSuccess(msg);
                    });
                });
                client.on('error', function (event) {
                    ZeroClipboard.destroy();
                });
            }
            return false;
        }
	</script>
</body>
</html>